<!DOCTYPE HTML>
<html>
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Home</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="" />
	<meta name="keywords" content="" />
	<meta name="author" content="" />
  	<!-- Facebook and Twitter integration -->
	<meta property="og:title" content=""/>
	<meta property="og:image" content=""/>
	<meta property="og:url" content=""/>
	<meta property="og:site_name" content=""/>
	<meta property="og:description" content=""/>
	<meta name="twitter:title" content="" />
	<meta name="twitter:image" content="" />
	<meta name="twitter:url" content="" />
	<meta name="twitter:card" content="" />

	<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet">
	
	<!-- Animate.css -->
	<link rel="stylesheet" href="/static/css/animate.css">
	<!-- Icomoon Icon Fonts-->
	<link rel="stylesheet" href="/static/css/icomoon.css">
	<!-- Themify Icons-->
	<link rel="stylesheet" href="/static/css/themify-icons.css">
	<!-- Bootstrap  -->
	<link rel="stylesheet" href="/static/css/bootstrap.css">

	<!-- Magnific Popup -->
	<link rel="stylesheet" href="/static/css/magnific-popup.css">

	<!-- Owl Carousel  -->
	<link rel="stylesheet" href="/static/css/owl.carousel.min.css">
	<link rel="stylesheet" href="/static/css/owl.theme.default.min.css">

	<!-- Theme style  -->
	<link rel="stylesheet" href="/static/css/style.css">

	<!-- Modernizr JS -->
	<script src="/static/js/modernizr-2.6.2.min.js"></script>
	<!-- FOR IE9 below -->
	<!--[if lt IE 9]>
	<script src="/static/js/respond.min.js"></script>
	<![endif]-->

    <!-- jQuery -->
	<script src="/static/js/jquery.min.js"></script>
	<!-- jQuery Easing -->
	<script src="/static/js/jquery.easing.1.3.js"></script>
	<!-- Bootstrap -->
	<script src="/static/js/bootstrap.min.js"></script>
	<!-- Waypoints -->
	<script src="/static/js/jquery.waypoints.min.js"></script>
	<!-- Carousel -->
	<script src="/static/js/owl.carousel.min.js"></script>
	<!-- countTo -->
	<script src="/static/js/jquery.countTo.js"></script>
	<!-- Magnific Popup -->
	<script src="/static/js/jquery.magnific-popup.min.js"></script>
	<script src="/static/js/magnific-popup-options.js"></script>
	<!-- Main -->
	<script src="/static/js/main.js"></script>

    <style>
        .error-message {
          color: red;
          font-size: 14px;
        }
    </style>

    <style>
        .success-message {
          color: green;
          font-size: 14px;
        }
    </style>

	</head>
	<body>
		
	<div class="gtco-loader"></div>
	
	<div id="page">

	
	<div class="page-inner">
	<nav class="gtco-nav" role="navigation">
		<div class="gtco-container">
			
			<div class="row">
				<div class="col-sm-4 col-xs-1">
					<div id="gtco-logo">
						<a href="#">
							<img src="/static/images/logo.png" height="130" width="380" alt="platformLogo"/>
						</a>
					</div>
				</div>
<!--				<div class="col-xs-8 text-right menu-1">-->
<!--					<ul>-->
<!--						<li><a href="features.html">Features</a></li>-->
<!--						<li><a href="tour.html">Tour</a></li>-->
<!--						<li class="has-dropdown">-->
<!--							<a href="#">Dropdown</a>-->
<!--							<ul class="dropdown">-->
<!--								<li><a href="#">Web Design</a></li>-->
<!--								<li><a href="#">eCommerce</a></li>-->
<!--								<li><a href="#">Branding</a></li>-->
<!--								<li><a href="#">API</a></li>-->
<!--							</ul>-->
<!--						</li>-->
<!--						<li><a href="pricing.html">Pricing</a></li>-->
<!--						<li><a href="contact.html">Contact</a></li>-->
<!--						<li class="btn-cta"><a href="#"><span>Get started</span></a></li>-->
<!--					</ul>-->
<!--				</div>-->
			</div>
			
		</div>
	</nav>
	
	<header id="gtco-header" class="gtco-cover" role="banner" style="background-image: url(/static/images/login_bkg.jpg)">
		<div class="overlay"></div>
		<div class="gtco-container">
			<div class="row">
				<div class="col-md-12 col-md-offset-0 text-left">
					

					<div class="row row-mt-15em">
						<div class="col-md-7 mt-text animate-box" data-animate-effect="fadeInUp">
							<span class="intro-text-small">Welcome to Tagged Platform</span>
							<h1>众包数据服务平台</h1>
						</div>
						<div class="col-md-4 col-md-push-1 animate-box" data-animate-effect="fadeInRight">
							<div class="form-wrap">
								<div class="tab">
									<ul class="tab-menu">
										<li class="active gtco-first"><a href="#" data-tab="signup">注册</a></li>
										<li class="gtco-second"><a href="#" data-tab="login">登录</a></li>
									</ul>
									<div class="tab-content">
										<div class="tab-content-inner active" data-content="signup">
											<form action="{% url 'login:staff_sign_submit' %}" id="signup-form" method="post" >
                                                {% csrf_token %}
                                                <!-- 注册：根据用户名和密码是否正确返回消息 -->
                                                <div id="sign_message">
                                                    {% if sign_result == 'success' %}
                                                        <span class="success-message">{{ msg }}</span>
                                                    {% elif sign_result == 'error' %}
                                                        <span class="error-message">{{ msg }}</span>
                                                    {% endif %}
                                                </div>
												<div class="row form-group">
													<div class="col-md-12">
														<label for="username_sign">员工号</label>
														<input type="text" class="form-control" id="username_sign" name="username">
													</div>
												</div>
												<div class="row form-group">
													<div class="col-md-12">
														<label for="password_sign">密码</label>
														<input type="password" class="form-control" id="password_sign" name="password">
													</div>
												</div>
                                                <input type="radio" name="sign_user_type" class="radio-input" value="staff" checked="checked" style="display: none"/>
												<div class="row form-group">
													<div class="col-md-12">
														<input type="submit" class="btn btn-primary" value="注册" name="sign_up">
													</div>
												</div>
											</form>	
										</div>

										<div class="tab-content-inner" data-content="login">
											<form id="login-form" method="post" action="{% url 'login:staff_login_submit' %}">
                                                {% csrf_token %}
                                                <!-- 登录：根据用户名和密码是否正确返回消息 -->
                                                <div id="login_message">
                                                    {% if login_result == 'error' %}
                                                        <span class="error-message">{{ msg }}</span>
                                                    {% endif %}
                                                </div>
												<div class="row form-group">
													<div class="col-md-12">
														<label for="username_login">员工号</label>
														<input type="text" class="form-control" id="username_login" name="username" >
													</div>
												</div>
												<div class="row form-group">
													<div class="col-md-12">
														<label for="password_login">密码</label>
														<input type="password" class="form-control" id="password_login" name="password">
													</div>
												</div>
                                                <input type="radio" name="login_user_type" class="radio-input" value="staff" checked="checked" style="display: none"/>
												<div class="row form-group">
													<div class="col-md-12">
														<input type="submit" class="btn btn-primary" value="登录" name="login">
													</div>
												</div>
											</form>	
										</div>

									</div>
								</div>
							</div>
						</div>
					</div>
							
					
				</div>
			</div>
		</div>
	</header>



	</div>

	</div>

	<div class="gototop js-top">
		<a href="#" class="js-gotop"><i class="icon-arrow-up"></i></a>
	</div>

	</body>
</html>

